<template>
    <div class="login">
        <el-row class="login">
            <div class="nav-logo width980">
                <img src="../static/logo.png" alt="" @click="$router.push('/home')" />
            </div>
        </el-row>
        <el-row class="container width980 clearFix">
            <img src="../static/login-logo.jpg" alt="" />
            <div class="form">
                <login-form-template> </login-form-template>
            </div>
            
        </el-row>
		<div class="footer-container width980">
                <ul class="footer">
                    <li v-for="(item, index) in footList" :key="item + index">
                        <a href="javascript:;">{{ item }}</a>
                    </li>
                </ul>
                <p>©2021 <a href="javascript:;">美团网团购 meituan.com</a> <a href="javascript:;">京ICP证070791号</a> 京公网安备11010502025545号</p>
            </div>
    </div>
</template>

<script>
import LoginFormTemplate from '../components/login-form-template.vue'
export default {
    components: {
        LoginFormTemplate,
    },
    data() {
        return {
            footList: ['关于美团', '加入我们', '商家入驻', '帮助中心', '美团手机版'],
        }
    },
    methods: {
		
	},
}
</script>

<style lang="less" scoped>
div.login {
    .el-row.login {
        div.nav-logo {
            height: 50px;
            margin: 40px auto !important;
            img {
                height: 47px;
                cursor: pointer;
            }
        }
    }
    .el-row.container {
        margin: 0 auto 40px;
        img {
            flex-grow: 0;
            float: left;
            margin-right: 50px;
        }
        div.form {
            float: left;
            height: 500px;
            width: 400px;
			padding: 0 20px;
        }
    }
    div.footer-container {
        ul.footer {
            border-top: 1px solid #ddd;
            border-bottom: 1px solid #ddd;
			padding-left: 0;
            display: flex;
            li {
                margin: 15px 30px  15px 0;
                a {
                    color: #888 !important;
                }
            }
        }
        p {
            font-size: 12px;
            color: #888;
			padding-bottom: 30px;
            a {
                color: inherit !important;
            }
        }
    }
}
</style>
